
<?php
$this->load->view('includes/header');
$this->load->view('includes/nav');
$article1 = array();
$article2 = array();
$article3 = array();
$article4 = array();

$article = 0;
foreach ($photos as $key => $value) {
    if ($article == 0) {
        array_push($article1, $value);
        $article++;
    } else if ($article == 1) {
        array_push($article2, $value);
        $article++;
    } else if ($article == 2) {
        array_push($article3, $value);
        $article++;
    } else if ($article == 3) {
        array_push($article4, $value);
        $article = 0;
    }
}
?>
<script src="<?php echo base_url(); ?>public/js/jquery.fullscreen.js" type="text/javascript"></script>
<script src="<?php echo base_url(); ?>public/js/libs/mustache.js"></script>
<script src="<?php echo base_url(); ?>public/js/lp_photos.js"></script>
<script src="<?php echo base_url(); ?>public/js/headerScrollFix.js"></script>
<section id="LeapMainWrapper">
    <section id="LeapContentWrapper">

        <section class="photoStream">
            <?php foreach ($article1 as $key => $value) { ?>
                <article class="photo" id="<?php echo $value['photo_id']; ?>">
                    <div class="image_">
                        <a class="photoPost" id="<?php echo $value['photo_id']; ?>" href="photos/<?php echo $value['photo_id']; ?>">
                            <img class="imgThumbPost" alt="<?php echo $value['title']; ?>" src="<?php echo $value['thumb']; ?>">
                        </a>
                    </div>
                    <h4 class="title"><?php echo $value['title']; ?></h4>
                    <p class="description"><?php echo $value['description']; ?></p>

                    <div class="clearfix"></div>
                </article>
            <?php } ?>
        </section>
        <section class="photoStream">
            <?php foreach ($article2 as $key => $value) {
                ?>
                <article class="photo" id="<?php echo $value['photo_id']; ?>">
                    <div class="image_">
                        <a class="photoPost" id="<?php echo $value['photo_id']; ?>" href="photos/<?php echo $value['photo_id']; ?>">
                            <img class="imgThumbPost" alt="<?php echo $value['title']; ?>" src="<?php echo $value['thumb']; ?>">
                        </a>
                    </div>
                    <h4 class="title"><?php echo $value['title']; ?></h4>
                    <p class="description"><?php echo $value['description']; ?></p>

                    <div class="clearfix"></div>
                </article>
            <?php } ?>
        </section>
        <section class="photoStream">
            <?php foreach ($article3 as $key => $value) { ?>
                <article class="photo" id="<?php echo $value['photo_id']; ?>">
                    <div class="image_">
                        <a class="photoPost" id="<?php echo $value['photo_id']; ?>" href="photos/<?php echo $value['photo_id']; ?>">
                            <img class="imgThumbPost" alt="<?php echo $value['title']; ?>" src="<?php echo $value['thumb']; ?>">
                        </a>
                    </div>
                    <h4 class="title"><?php echo $value['title']; ?></h4>
                    <p class="description"><?php echo $value['description']; ?></p>

                    <div class="clearfix"></div>
                </article>
            <?php } ?>
        </section>
        <section class="photoStream">
            <?php foreach ($article4 as $key => $value) { ?>
                <article class="photo" id="<?php echo $value['photo_id']; ?>">
                    <div class="image_">
                        <a class="photoPost" id="<?php echo $value['photo_id']; ?>" href="photos/<?php echo $value['photo_id']; ?>">
                            <img class="imgThumbPost" alt="<?php echo $value['title']; ?>" src="<?php echo $value['thumb']; ?>">
                        </a>
                    </div>
                    <h4 class="title"><?php echo $value['title']; ?></h4>
                    <p class="description"><?php echo $value['description']; ?></p>

                    <div class="clearfix"></div>
                </article>
            <?php } ?>
        </section>
    </section>
    <?php $this->load->view('includes/sidebar'); ?>   
    <div class="clearfix"></div>
</section>
<!-- Overlay -->
<script id="photoOverlay_template" type="text/template">
    <div class="photo_overlay" id="{{photo_id}}">
        <div class="overlay_head">
            <p>{{title}}</p>
            <span class="close_overlay"></span>
        </div>
        <div class="overlay_content">
            <div class="photoWrapper">
                {{{image}}}
            </div>
            <div class="photoInfos">
                <span class="profileP">
                    {{{profile_img}}}
                    <p class="name"><a href="/{{username}}">{{name}}</a></p>
                    <p class="username">{{username}}</p>
                </span>
                <div class="followButton">
                    <div class="button follow">Follow</div>
                </div>
                <span class="photoAction">
                    <ul id="{{photo_id}}">
                        <li>
                            <span>{{comment_count}}</span> comments
                        </li>
                        <li >
                            {{#did_like}}
                            <div class="FireCount_f" {{#connect}} id="FirePhoto" {{/connect}} >
                                 {{/did_like}}
                                 {{^did_like}}
                                 <div class="FireCount" {{#connect}} id="FirePhoto" {{/connect}} >
                                 {{/did_like}}
                                 {{likes}}
                            </div>
                    </li>
                    <li >
                        {{#did_fav}}
                        <div class="FavCount_f" {{#connect}} id="FavPhoto" {{/connect}} >
                             {{/did_fav}}
                             {{^did_fav}}
                             <div class="FavCount" {{#connect}} id="FavPhoto" {{/connect}} >
                             {{/did_fav}}

                             {{favorites}}
                        </div>
                </li>
            </ul>
        </span>
        <span class="dateWrapper">

            <p class="date">{{date}}</p>
        </span>
        <span class="original_photographer">
            <p class="photographer">
                {{#photographer}}
                {{photographer}}
                {{/photographer}}
                {{^photographer}}
                Unknown
                {{/photographer}}
            </p>
        </span>
    </div>
    <div class="clearfix"></div>

    <div class="commentsWrapper">
        {{#connect}}
        <div class="postcomment">
            <div class="commentProfilePic">

                <span class="profilePicWrapper" ><img src="<?php echo $profile_pic; ?>" width="50" height="50" /></span>
            </div>
            <div class="postCommentBody">
                <textarea class="comment" placeholder="Add comment..."></textarea>
            </div>
            <div class="postSubmit">
                <span id="postComment" class="button_blue">Comment</span>
            </div>
        </div>
        {{/connect}}
        <div class="commentstream">
            <ul>
                {{#comments}}
                <li>
                    <span class="profilePicWrapper" ><img src="{{user_profile_pic_thumb}}" width="30" height="30" /></span>
                    <div class="commentInfos">
                        <p class="user_name"><a href="{{user_name}}">{{user_name}}</a></p>
                        <p class="added">{{timestamp}}</p>
                    </div>
                    <p class="comment_">{{comment}}</p>
                    <div class="clearfix">
                    </div>
                </li>
                {{/comments}}
            </ul>
        </div>

    </div>
</div>
</div>
</script>
<div class="overlay_bg"></div>
<script>
    $.lp.init();
</script>
<?php
$this->load->view('includes/footer');
?>